<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    {% load static %}
    <link rel="stylesheet" href="{% static 'css/navbar.css' %}">
    <link rel="stylesheet" href="{% static 'css/introduction.css' %}">
    <title>Berry - Info</title>

    <script src="{% static "/js/mermaid.min.js" %}"></script>
</head>
<body>
{% include "navbar.html" %}

<div class="whole_div">
    <ul role="list">
        <li>
            <div class="intro-container">
                {% load static %}
                <img src="{% static 'images/logo.png' %}" alt="company-image">

                <div class="tile_headline">
                    Berry Inc. (中国大陆) 公司
                </div>
                <p class="intro-detail">
                    Berry Inc. 公司致力于打造真正高精尖的电子产品
                </p>
                <p>
                    做出真正完美的电子艺术品
                </p>
            </div>
        </li>

        <li>
            <div class="intro-container">
                <div class="tile_headline">
                    企业文化 - OrgCul
                </div>

                <p class="intro-detail">
                    给予人完美无瑕的工具
                </p>

                <p class="intro-detail">
                    人们能做到完美无瑕的事情
                </p>
            </div>
        </li>

        <li>
            <div class="intro-container">
                <div class="tile_headline">
                    企业架构 - OrgStruct
                </div>

                <div class="mermaid">
                    graph TB
                    A[CEO]
                    B[CTO]
                    C[CFO]
                    D[Engineering]
                    E[Sales]
                    F[Marketing]
                    G[Support]

                    A --> B
                    A --> C
                    A --> D
                    A --> E
                    A --> F

                    B --> D
                    C --> E
                    C --> G
                    D --> G
                    E --> F
                </div>
            </div>

            <script>
                mermaid.initialize({startOnLoad: true})
            </script>
        </li>
    </ul>
</div>

</body>
</html>